{extend name="common/base"/}
<!-- 主体 -->
{block name="body"}
<div class="p-3">
    <form class="layui-form gg-form-bar border-t border-x">

        <div class="layui-input-inline" style="width:300px;">
            <input type="text" name="keywords" placeholder="股票代码/昵称" class="layui-input" autocomplete="off" />
        </div>

        <button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="webform">搜索</button>
    </form>
    <table class="layui-hide" id="cs" lay-filter="cs"></table>
</div>

<script type="text/html" id="barDemo">
    <div class="layui-btn-group">
        <a class="layui-btn layui-btn-xs" lay-event="view">查看</a>
    </div>
</script>
<script type="text/html" id="toolbarDemo">
    <div class="layui-btn-container">
        <!--<button class="layui-btn layui-btn-normal layui-btn-sm add-menu">+ 新建账号</button>-->
    </div>
</script>

{/block}
<!-- /主体 -->

<!-- 脚本 -->
{block name="script"}
<script>
    const moduleInit = ['tool'];
    function gouguInit() {
        var table = layui.table,tool = layui.tool, form = layui.form;
        layui.pageTable = table.render({
            elem: '#cs',
            title: '测算结果列表',
            toolbar: '#toolbarDemo',
            url: '/webadmin/users/cslist', //数据接口
            page: true, //开启分页
            limit: 20,
            cols: [
                [ //表头
                    {
                        field: 'id',
                        title: 'id',
                        align: 'center',
                        width: 100
                    }, {
                    field: 'nickname',
                    title: '昵称',
                    align: 'center',
                    width: 120
                }, {
                    field: 'codes',
                    title: '股票代码',
                    align: 'center',
                    width: 120,
                } ,{
                    field: 'name',
                    title: '名称',
                    align: 'center',
                    width: 120,
                } ,{
                    field: 'buy_dates',
                    title: '买入日期',
                    align: 'center',
                    width: 100,
                }, {
                    field: 'buy_price',
                    title: '买入价格',
                    align: 'center',
                    width: 100,
                }, {
                    field: 'sell_dates',
                    title: '卖出时间',
                    align: 'center',
                    width: 100,
                },{
                    field: 'sell_price',
                    title: '卖价格',
                    align: 'center',
                    width: 100,
                },{
                    field: 'sell_num',
                    title: '卖出数量',
                    align: 'center',
                    width: 100,
                },{
                    field: 'num',
                    title: '持有数量',
                    align: 'center',
                    width: 100,
                },{
                    field: 'right',
                    fixed: 'right',
                    title: '操作',
                    toolbar: '#barDemo',
                    align: 'center'
                }
                ]
            ]
        });
        //监听行工具事件
        table.on('tool(cs)', function(obj) {
            var data = obj.data;
            if (obj.event === 'view') {
                tool.side('/webadmin/users/csinfo?id='+data.id);
                return;
            }
        });

        //监听搜索提交
        form.on('submit(webform)', function(data) {
            layui.pageTable.reload({
                where: {
                    keywords: data.field.keywords,
                    //type: data.field.type,
                },
                page: {
                    curr: 1
                }
            });
            return false;
        });
    }
</script>
{/block}
<!-- /脚本 -->
